.center(@rw:center,@vl:center,@type:row){
  display: flex;
  justify-content: @rw;
  align-items:@vl;
  flex-direction: @type;
}

.header-nav {
  height: 104px;
  background-color: #262728;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 17px 30px 20px 11px;
  .back-button{
    flex: 0 0 auto;
    margin-right: 10px;
    font-size: 24px;
  }

  .icon-caidan {
    font-size: 60px;
  }

  .am-search-synthetic-ph{
    width: 180px !important;
    padding-left: 0 !important;
  }
  .am-search-input .am-search-clear{
    top: 16px;
    right: 10px;
  }

  .am-search {
    background-color: transparent;
    padding: 0 16px 0 0;
    .am-search-value{
      padding-left: 180px !important;
    }
    .am-search-synthetic-ph-container {
      position: relative;

      .am-search-synthetic-ph-icon {
        position: absolute;
        right: -170px;
      }

      .am-search-synthetic-ph-placeholder {
        visibility: visible !important;
        position: absolute;
        width: 1rem;
        left: 0.2rem;
      }
    }
  }

  .header-title, .back-button {
    color: #fff;
  }

  .am-search{
    width: 620px;
    height: 67px;
    border-radius: 9px;
    &-cancel {
      display: none !important;
    }
    >div{
      height: 100%;
      display: flex;
      align-items: center;
      padding-left: 20px;
      >div{
        height: 100%;
        width: 100%;
        display: flex;
        align-items: center;
        span{
          font-size: 22px;
          display: flex;
          align-items: center;
          .am-search-synthetic-ph-icon{
            width: 30px;
            height: 30px;
            background-size: contain;
          }
        }
      }
      input{
        height: 100%;
      }
    }
  }

  .login {
    color: #fff;
    font-size: 22px;
    display: inline-block;
    width: 60px;

    .iconfont{
      font-size: 30px;
    }
  }

}